<template>
  <div :class="$style.root">
    <el-form :inline="true" :model="formQuery" label-position="right">
      <el-row>
        <el-col :span="6">
          <el-form-item label="蜂窝编码" :label-width="basicWidth">
            <el-input v-model="formQuery.cellularCode" placeholder="请输入" style="width: 90%" clearable />
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="蜂窝名称" :label-width="basicWidth">
            <el-input v-model="formQuery.cellularName" placeholder="请输入" style="width: 98%" clearable />
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="顶级渠道" :label-width="basicWidth">
            <el-select clearable v-model="formQuery.topChannelCode" placeholder="请选择" style="width: 90%" filterable>
              <el-option v-for="item in topChannelList" :key="item.id" :label="item.name" :value="item.id" />
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="3">
          <el-form-item label="分公司" :label-width="basicWidth">
            <el-input v-model="formQuery.company" placeholder="请输入" style="width: 90%" clearable />
          </el-form-item>
        </el-col>
        <el-col el-col :span="3">
          <el-form-item label="自动调价" :label-width="basicWidth">
            <el-select v-model="formQuery.autoPrice" placeholder="请选择" clearable>
              <el-option label="是" value="Y" />
              <el-option label="否" value="N" />
            </el-select>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="4">
          <el-form-item label="城市" :label-width="basicWidth">
            <el-cascader
              v-model="formQuery.city"
              :options="cityList"
              :show-all-levels="false"
              placeholder="请选择城市"
              clearable
              filterable
              style="width: 90%"
              :props="{ checkStrictly: true }"
            />
          </el-form-item>
        </el-col>
        <el-col :span="4">
          <el-form-item label="蜂窝类型" :label-width="basicWidth">
            <el-select clearable v-model="formQuery.cellularClassify" placeholder="请选择" style="width: 90%" filterable>
              <el-option v-for="item in cellularClassifyList" :key="item.id" :label="item.label" :value="item.id"></el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="4">
          <el-form-item label="调价优先级" label-width="90px">
            <el-select v-model="formQuery.cellularPriority" placeholder="请选择" clearable>
              <el-option v-for="item of cellularPriorityList" :key="item.key" :label="item.value" :value="item.key"></el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="7" :label-width="basicWidth">
          <el-form-item label="创建时间">
            <el-date-picker
              v-model="createTime"
              type="datetimerange"
              range-separator="-"
              start-placeholder="开始日期"
              end-placeholder="结束日期"
              style="width: 98%;"
              format="yyyy-MM-dd HH:mm:ss"
              @change="timeChange"
            >
            </el-date-picker>
          </el-form-item>
        </el-col>
        <el-col :span="3" :label-width="basicWidth">
          <el-button @click="onQuery" type="primary" :loading="querying">查询</el-button>
          <el-button @click="reset" type="info">重置</el-button>
        </el-col>
      </el-row>
      <el-divider></el-divider>
    </el-form>
  </div>
</template>

<style lang="scss" module>
@import './index.module.scss';
</style>

<script>
import Index from './index';
export default Index;
</script>
